<template>
	<view class="container">
		<view class="content">
			<image src="../../static/images/mask_home.png" mode="aspectFit"></image>
			<view class="content_title">— 书房 —</view>
		</view>
		<view class="content">
			<image src="../../static/images/mask_bookshelf.png" mode="aspectFit"></image>
			<view class="content_title">—  客厅  —</view>
		</view>
		<view class="content">
			<image src="../../static/images/mask_bookshelf.png" mode="aspectFit"></image>
			<view class="content_title">— 客厅 —</view>
		</view>
		<button type="primary">确定预约</button>
	</view>
</template>

<script>
</script>

<style>
	button{
		width: 328rpx;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		background: #3d9c36;
		border-radius: 8rpx;
		margin-top: 80rpx;
		margin-bottom:170rpx;
		display: block;
	}
	.content {
		width: 100%;
		height: 100%;
		margin-top: 32rpx;
		margin-left: 40rpx;
		
	}

	.content image {
		width: 670rpx;
		height: 406rpx;
		background: rgba(0, 0, 0, 0.10);
		vertical-align: top;
		
	}

	.content_title {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 670rpx;
		height: 74rpx;
		background: #ffffff;
		border-radius: 0rpx 0rpx 12rpx 12rpx;

	}
	.container{
		  box-sizing: border-box;
		  width: 100vw;
		  display: flex;
		  flex-direction: column;
		  align-items: center;
	}
</style>
